<script setup>
import img1 from '../../../static/2130@2x.png'
import img2 from '../../../static/2163@2x.png'
import uniNavBar from '../../../uni_modules/uni-nav-bar/components/uni-nav-bar/uni-nav-bar.vue'
</script>

<template>
  <view>
    <view id="TEXT">
      <uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" status-bar left-icon="left" left-text="返回"
                   title="请假申请" @clickLeft="back" />
      <view id="textA">
        <view id="textB">
          <image class="img1"  :src="img1"></image>
          <text class="text">
            当前请假审批已通过。24点后将关闭进出权限。进
          </text>
        </view>
      </view>
      <view id="texc">
        <view id="kuang1">
          <text class="text1">
            程新远 提交的请假
          </text>
          <text class="text2">
            软件学院
          </text>
          <image class="img2"  :src="img2"></image>

        </view>
        <hr>
        <view id="kuang2">
          <text class="text3">
            所在年级：2024级

          </text>
          <text class="text4">
            所在专业：软件工程

          </text><text class="text5">
          所在班级：24130425班

        </text>
        </view>
      </view>
      <view id="textD">
        <view id="textE">
          <text class="text6">
            请假时长：1天
          </text>
        </view>
      </view>
    </view>
  </view>
</template>

<style scoped>
#TEXT{
  width: 100%;
  height: 1475px;
  background: #f5f5f5;
}
#textA{
  width: 100%;
  height: 81px;
  background: linear-gradient(180.00deg, #2264ff 0%, #f5f5f5 100%);
  display: flex;
  justify-content: center;
}
#textB{
  width: 85%;
  height: 39px;
  border-radius: 12px 12px 0 0;
  background: #fffae7;
  margin-top: 27px;
  display: flex;
  justify-content: center;

}
.text{
  font-weight: 400;
  font-size: 14px;
  text-align: left;
  color: #313133;
  padding: 6px;

}
.img1{
  width: 15px;
  height: 15px;
  background: transparent;
  margin-top: 10px;
}


#texc{
  width: 90%;
  height: 157px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 2px 4px #e6e6e64d;
  margin-top: -16px;
  margin-left: 5%;
  margin-right: 5%;
  z-index: 10000;
}

.text1{
  font-weight: 700;
  font-size: 18px;
  text-align: left;
  color: #1a1a1a;
  margin-top: 10px;
  margin-left: 20px;
}
.text2{
  font-weight: 400;
  font-size: 13px;
  text-align: left;
  color: #808080;
  margin-left: -148px;
  margin-top: 40px;
}

.img2{
  width: 70px;
  height: 70px;
  background: transparent;
  margin-left: 220px;
  margin-top: 8px;
}
#hr{
  width: 312px;
  height: 0;
  background: transparent;
  border: 0.5px solid #dbdbdb;
}
#kuang1{
  width: 100%;
  height: 80px;
  display: flex;

}
#kuang2{
  width: 100%;
  height: 77px;
  display: flex;
}
.text3{
  font-weight: 400;
  font-size: 13px;
  text-align: left;
  color: #808080;
  margin-left: 20px;
  margin-top: 10px;
}
.text4{
  font-weight: 400;
  font-size: 13px;
  text-align: left;
  color: #808080;
  margin-left: -107px;
  margin-top: 30px;
}
.text5{
  font-weight: 400;
  font-size: 13px;
  text-align: left;
  color: #808080;
  margin-left: -117px;
  margin-top: 50px;
}
#textD{
  width: 90%;
  height: 157px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 4px #e6e6e64d;
  margin-left: 5%;
  margin-right: 5%;
  z-index: 10000;
  margin-top: 10px;
  display: flex;
}
#textE{
  width: 100%;
  height: 60px;
  display: flex;
}
.text6{
  font-weight: 700;
  font-size: 16px;
  text-align: left;
  color: #1a1a1a;
  margin-top: 8px;
  margin-left: 16px;
}
</style>